import { createBrowserRouter } from "react-router-dom";

import App from '../App'
import Error from '../pages/404'
import { lazy } from "react";

const Login = lazy(() => import('../pages/login'))
const Reg = lazy(() => import('../pages/reg'))
const Home = lazy(() => import('../pages/home'))
const About = lazy(() => import('../pages/about'))
const Life = lazy(() => import('../pages/life'))
const Tag = lazy(() => import('../pages/tag'))
const Takle = lazy(() => import('../pages/takle'))
const User = lazy(() => import('../pages/user'))
const Detail = lazy(() => import('../pages/detail'))

export const elser = [
    {
        path: 'home',
        element: <Home />,
        title: 'home',
    },
    {
        path: 'user',
        element: <User />,
        title: 'time'
    },
    {
        path: 'tag',
        element: <Tag />,
        title: 'tag'
    },
    {
        path: 'takle',
        element: <Takle />,
        title: 'takle'
    },
    {
        path: 'life',
        element: <Life />,
        title: 'life'
    },
    {
        path: 'about',
        element: <About />,
        title: 'about'
    },
]
const route = [
    {
        path: '/',
        element: <App />,
        children: elser
    },
    {
        path: '/login',
        element: <Login />,
    },
    {
        path: '/reg',
        element: <Reg />,
    },
    {
        path: '/detail/:id',
        element: <Detail />,
    },
    {
        path: '*',
        element: <Error />
    }
]
const routes = createBrowserRouter(route)
export default routes